<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
    <title>电网图</title>
    <style>
        body {
            position: absolute;
            margin: 0;
            width: 100%;
            height: 100%;
        }

        #mapContainer {
            left: 0px;
            top: 0px;
            width: 100%;
            height: 100%;
            float: left;
        }
    </style>
</head>

<body>
    <div id="mapContainer" style="position: relative;"></div>
</body>
<script src='/GiswayEngine.js'></script>
<script src="/examples/model//FlowLine1.js"></script>
<script type="text/javascript">
    var eletricPlaneArray = [];
    var ipAddress = 'http://192.168.2.41:9000/';

    window.app = new GE.App('mapContainer', {
        position: [120.2333057372291, 30.333910661137568, 2500], //相机的位置
        lookAt: [120.2333057372291, 30.333910661137568, 0], //相机看向的地图位置
        cameraScrollSpeed: 5, //鼠标滚动时，控制相机上下移动的速度
        minZoom: 13, //允许地图的最小层级
        maxZoom: 18, //允许地图的最大层级
        ambientLightIntensity: 5,
        useDefaultTexture: true, //是否使用瓦片默认纹理
        background: "Color", //背景的类型，参数有如下类型：None, Fog, Color, Gradient, Image, Sky, Image。使用Fog地图的性能会比较好
        // backGroundColorA:'#AAAAFF', //当background的值为Gradient时，需要配置该参数。最下端颜色，默认值为#0000FF
        // backGroundColorB:'#0000FF', //当background的值为Gradient时，需要配置该参数。最上端颜色，默认值为#FF0000
        backGroundColor: '#4B0082', //当background的值为Color时，需要配置该参数，默认值为#00BFFF
        // imageUrl: ipAddress + 'examples/assets/img_logo.39362dc1.png', //当background的值为Image时，需要配置该参数。默认值为null
        baseLayer: [
            
        ]
    });

    window.app.on('Click', function (e) {
        console.log(e);
    });

    let offsetY = 0.002;
    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/双向整流器.glb', [120.22129558123218, 30.333792426655716, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.22033847167029, 30.33379186860915, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.22750925231481, 30.333792426655716, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point( 120.22742945311003, 30.33304521886397, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/开关2.glb', [120.23210537538453, 30.333792426655716, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point( 120.23210537538453, 30.33304521886397, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.23676755152881, 30.333792426655716, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point( 120.23676755152881, 30.33304521886397, 0), curent: 220, voltage: 55, resistance: 0.2})



    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.23981928792558, 30.337511921541548-offsetY, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.24051692646606, 30.334744626577898, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.23981928792558, 30.329592479981233+offsetY, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.24413693118876, 30.334744626577898, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.24356756647166, 30.33750669518023-offsetY, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.24802304165506, 30.334744626577898, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.24356756647166,30.329583196527924+offsetY, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.24057021278301, 30.332425408964617, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.2473919968493, 30.33750669518023-offsetY, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.24416856889651, 30.332425408964617, 0), curent: 220, voltage: 55, resistance: 0.2})

    this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.2473919968493,30.329583196527924+offsetY, 0], 'gltf', 100);
    this.setElectricPlane({position: new GE.Point(120.24827545718221, 30.332425408964617, 0), curent: 220, voltage: 55, resistance: 0.2})

    let flyline0 = new GE.FlowLine2({
            positions: [
                new GE.Point(120.22129558123218, 30.333792426655716, 0),
                new GE.Point(120.2473919968493, 30.333792426655716, 0),
                // new GE.Point(120.2473919968493,30.329583196527924, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F', 
            spaceDistance: 10,
            narrowLength: 40,
            waitTime: 0,
            loopMsg: {loopTime: 3, sleepTime: 1000}
    });
    app.add(flyline0);

    let flyline1 = new GE.FlowLine2({
            positions: [
            // new GE.Point(120.22129558123218, 30.333792426655716, 0),
            // new GE.Point(120.2473919968493, 30.333792426655716, 0),
                new GE.Point(120.2473919968493, 30.333792426655716, 0),
                new GE.Point(120.2473919968493, 30.33750669518023-offsetY, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F', 
            spaceDistance: 5,
            narrowLength: 25,
            waitTime: 8,
            
    });
    app.add(flyline1);

    let flyline2 = new GE.FlowLine2({
            positions: [
                new GE.Point(120.24356756647166, 30.333792426655716, 0),
                new GE.Point(120.24356756647166, 30.33750669518023-offsetY, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F', 
            spaceDistance: 5,
            narrowLength: 25,
            waitTime: 8,
    });
    app.add(flyline2);

    let flyline3 = new GE.FlowLine2({
            positions: [
                // new GE.Point(120.24296756647166, 30.333792426655716, 0),
                // new GE.Point(120.24296756647166, 30.329583196527924, 0)
                new GE.Point(120.24356756647166, 30.333792426655716, 0),
                new GE.Point(120.24356756647166, 30.329583196527924+offsetY, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F', 
            spaceDistance: 5,
            narrowLength: 25,
            waitTime: 8,
    });
    app.add(flyline3);

    let flyline4 = new GE.FlowLine2({
            positions: [
                new GE.Point(120.23981928792558, 30.333792426655716, 0),
                new GE.Point(120.23981928792558, 30.329592479981233+offsetY, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F',  
            spaceDistance: 5,
            narrowLength: 25,
            waitTime: 8,
    });
    app.add(flyline4);

    let flyline5 = new GE.FlowLine2({
            positions: [
                new GE.Point(120.23981928792558, 30.333792426655716, 0),
                new GE.Point(120.23981928792558, 30.337511921541548-offsetY, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F', 
            spaceDistance: 5,
            narrowLength: 25,
            waitTime: 8,
    });
    app.add(flyline5);

    let flyline6 = new GE.FlowLine2({
            positions: [
            // new GE.Point(120.22129558123218, 30.333792426655716, 0),
            // new GE.Point(120.2473919968493, 30.333792426655716, 0),
                new GE.Point(120.2473919968493, 30.333792426655716, 0),
                new GE.Point(120.2473919968493, 30.329583196527924+offsetY, 0)
            ],
            lineColor: '#00CED1',
            startColor: '#00CED1',
            endColor: '#00FF7F', 
            spaceDistance: 5,
            narrowLength: 25,
            waitTime: 8,
            
    });
    app.add(flyline6);




    generationFlowLine1(0.002, '#00BFFF', '#00BFFF', '#87CEFA');
    generationFlowLine1(0.013, '#008B8B', '#008B8B', '#FF00FF');







    
    // let flyline = new GE.FlowLine2({
    //         positions: [
    //             new GE.Point(120.170646, 30.28362, 0),
    //             new GE.Point(120.270646, 30.28362, 0),
    //             new GE.Point(120.270646, 30.38362, 0),
    //             new GE.Point(120.17020432419753, 30.38362, 0),
    //         ],
    //         lineColor: '#00FA9A',
    //         startColor: '#DCDCDC',
    //         endColor: '#FF4500', 
    // });
    // app.add(flyline);
    // this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/整流器.glb', [120.170646, 30.28362, 0], 'gltf', 1000);
    // this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/蓄电池.glb', [120.170646, 30.38362, 0], 'gltf', 1000);

    // let flyline2 = new GE.FlowLine2({
    //         positions: [
    //             new GE.Point(120.19418201972054, 30.28362, 0),
    //             new GE.Point(120.19418201972054, 30.38362, 0),
    //             // new GE.Point(120.270646, 30.38362, 0),
    //             // new GE.Point(120.17020432419753, 30.38362, 0),
    //         ],
    //         lineColor: '#FA8072',
    //         startColor: '#DCDCDC',
    //         endColor: '#A52A2A',
    // });
    // app.add(flyline2);
    // this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/开关2.glb', [120.19415106183355,30.3337651511754, 0], 'gltf', 500);

    // let flyline3 = new GE.FlowLine2({
    //         positions: [
    //             new GE.Point(120.23586905159297, 30.28362, 0),
    //             new GE.Point(120.23586905159297, 30.38362, 0),
    //             // new GE.Point(120.270646, 30.38362, 0),
    //             // new GE.Point(120.17020432419753, 30.38362, 0),
    //         ]//, startTime:10000
    //         , lineColor: '#AFEEEE',
    //         startColor: '#FAF0E6',
    //         endColor: '#FF7F50',
    // });
    // app.add(flyline3);
    // this.loadModel(ipAddress + 'examples/resources/gltf/eletricTest/开关2.glb', [120.23558795024303,30.3337651511754, 0], 'gltf', 500);

    function loadModel(url, position, type, scale) {
        model = new GE.OverLay({
            type: type,
            url: url,
            dracoPluginUrl: ipAddress + 'examples/resources/plugin/draco/',
            // mtlUrl: extraUrl,
            // url: ipAddress + 'examples/resources/fbx/ceshi1.FBX',
            // url:'http://192.168.2.43:9000/examples/resources/fbx/box.gltf',
            position: position, //[122.00151626214978, 40.71106690828059, 20.0],
            changeEmissive: false,
            gltfUpAxis: 'Z',
            // gltfUpAxis: 'Y',
            scale: [scale, scale, scale],
            // rotation: [90, 0, 0],
            // isUseContourLine: true, //是否使用等高线
            success: function (fbxParent) {
                   traverseMeshes(model, function(mesh){
                   if(mesh.material.length > 1){
                        mesh.material.forEach(element => {
                            element.renderOrder = 1000;
                            element.depthTest = false;
                            element.transparent = true;
                            element.needsUpdate = true;
                        });
                   }else{
                        mesh.renderOrder = 1000;
                        mesh.material.depthTest = false;
                        mesh.material.transparent = true;
                        mesh.material.needsUpdate = true;
                   }
                });
            }
        })
        app.add(model);
       

        // window.app.camera.addIntersectObjWithEye(model); //该模型和相机做相交检测，避免穿透

        window.model = model;
    }

    function traverseMeshes(mesh, callback) {
        // 对当前mesh执行回调
        if (mesh.type == 'Mesh') {
            callback(mesh);
        }
        // 遍历子节点
        mesh.children.forEach(child => {
            if (child.isObject3D) {
                traverseMeshes(child, callback);
            }
        });
    }

    function setElectricPlane(electricMsg) {
        let eletricPlane = new GE.EletricPlane(electricMsg); 
        eletricPlaneArray.push(eletricPlane);
    }

    setInterval(() => {
        eletricPlaneArray.forEach(element => {
            //生成200-250之间的随机数
            let randomNum = Math.floor(Math.random() * 51) + 200;

            //生成4-60之间的随机数
            let randomNum2 = Math.floor(Math.random() * 57) + 4;

            //生成0-0.4之间的随机数
            let randomNum3 = Math.random() * 0.4;
            randomNum3 = randomNum3.toFixed(2);

            let electricMsg = {curent: randomNum, voltage: randomNum2, resistance: randomNum3};
            element.updateContent(electricMsg);
        });
    }, 500);

    // function createPlane() {
    //     const position = new GE.Point(120.2323057372291, 30.331910661137568, 0, '4326').toEPSGWeb();
    //     let geometryWidth = 100;
    //     const geometry = new GE.three.PlaneGeometry( geometryWidth, geometryWidth );
    //     const material = new GE.three.MeshBasicMaterial(  ); //{color: 0xffff00}
    //     const plane = new GE.three.Mesh( geometry, material );
    //     plane.position.copy(position);
    //     app.add( plane );

    //     let drawingCanvas = document.createElement('canvas');
    //     drawingCanvas.width = 750;
    //     drawingCanvas.height = 512;
    //     var ctx=drawingCanvas.getContext('2d');
    //     ctx.fillStyle='#00BFFF';
    //     ctx.fillRect(0,0,1024,512);

    //     ctx.font="120px Georgia";
    //     ctx.fillStyle = '#FF4500';
    //     ctx.textAlign = "left"; // 水平居中对齐
    //     ctx.textBaseline = "top"; // 垂直中线对齐[5,7](@ref)
    //     let text = "电流: 220";
    //     ctx.fillText(text,60,20);

    //     text = "电压: 55";
    //     let height = comupteTextHeight(ctx, text);
    //     ctx.fillText(text, 60, height+60);

    //     text = "电阻: 0.2";
    //     height += comupteTextHeight(ctx, text);;
    //     ctx.fillText(text, 60, height+120);

    //     material.map = new GE.three.CanvasTexture(drawingCanvas);
    // }

    // function comupteTextHeight(ctx, text){
    //     let metrics = ctx.measureText(text);
    //     let height = metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent;
    //     return height;
    // }
    // createPlane();

</script>

</html>